// 定义vuex的模块化对象
export default {
  namespaced: true,
  state: {
    todos: JSON.parse(localStorage.getItem('todos')) || [],
    editId: undefined,
  },
  actions: {
    add({ commit }, e) {
      // actions中主要负责判断用户输入的是否为空,不为空则触发mutations去添加数据,为空则什么都不做
      const todoName = e.target.value.trim()
      if (!todoName) return
      commit('addTodo', todoName)
      e.target.value = ''
    },

    delOne({ commit }, id) {
      if (confirm('您确定要删除吗?')) {
        commit('delOneTodo', id)
      }
    },

    async delAllCheck({ commit }) {
      if (confirm('您确定要删除吗?')) {
        await new Promise((resolve) => {
          setTimeout(() => {
            resolve()
          }, 2000)
        })
        commit('delAllCheckTodos')
      }
    },

    setTodoName({ commit }, { id, e }) {
      const todoName = e.target.value.trim()
      if (!todoName) return
      commit('editTodoName', { id, todoName })
    },
  },
  mutations: {
    addTodo(state, todoName) {
      const todo = {
        id: Date.now(),
        todoName,
        isDone: false,
      }
      state.todos.push(todo)
    },

    updateTodo(state, id) {
      // console.log(id)
      state.todos.forEach((item) => {
        if (item.id === id) item.isDone = !item.isDone
      })
    },

    delOneTodo(state, id) {
      state.todos = state.todos.filter((item) => item.id !== id)
    },

    allCheck(state) {
      // 先计算当前所有数据是否被选中
      // 如果所有数据都选中,result就是true,则要赋值为false
      // 如果所有数据中有一个未选中,result就是false,则要赋值为true
      const result = state.todos.every((item) => item.isDone)
      state.todos.forEach((item) => {
        item.isDone = !result
      })
    },
    delAllCheckTodos(state) {
      state.todos = state.todos.filter((item) => !item.isDone)
    },
    setEditId(state, id) {
      state.editId = id
    },
    editTodoName(state, { id, todoName }) {
      state.todos.forEach((item) => {
        if (item.id === id) {
          item.todoName = todoName
        }
      })
      state.editId = undefined
    },
  },
  getters: {
    allTotal(state) {
      return state.todos.length
    },
    doneTotal(state) {
      return state.todos.filter((item) => item.isDone).length
    },
  },
}
